<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<title>我的预约</title>
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<link rel="stylesheet" href="../../../css/reset.css" />
		<link rel="stylesheet" href="../../../css/mui.min.css" />
		<link rel="stylesheet" href="../../../css/iconfont.css" />
		<link rel="stylesheet" href="../../../css/cmms.css" />
		<link rel="stylesheet" href="../../../css/sale/bespeak/bespeak.css" />
		<link rel="stylesheet" href="../../../css/doctor/myBespeak.css" />
	</head>
	<body>
		<div class="mui-content" id="bespeak" v-cloak>
		    <div class="mui-content">
			<div id="slider" class="mui-slider">
				<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
					<a class="mui-control-item mui-active" href="#item1mobile">
						待确认{{unconfNum}}
					</a>
					<a class="mui-control-item" href="#item2mobile">
						已确认{{confNum}}
					</a>
				</div>
				<div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-6"></div>
				<div class="mui-slider-group">
					<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
						<div id="scroll1" class="mui-scroll-wrapper">
							<div class="mui-scroll">
								<section class="panel confirmPanel" v-for="t in toBeConfirmed">
									<div>
										<div class="overflow">
											<span class="left">{{t.doctorName}}</span>
											<span class="right">{{t.createTime|replaceT}}</span>
										</div>
										<p>{{t.hospitalName}}</p>
									</div>
									<div class="overflow">
										<i class="iconfont icon-dizhi left"></i>
										<div class="left">{{t.hospitalAddress}}</div>
									</div>
									<div class="overflow"> 
										<span>上门时间  {{t.appointmentPreiod}}</span>
										<a :href="'tel:'+t.phone"><span class="btn-order-detail right">联系业务员</span></a>
									</div>
								</section>
								<footer class="nomore" v-show="toBeConfirmed.length>0">
									<span></span>
									<span>没有更多了</span>
									<span></span>
								</footer>
								<div class="noData" v-show="!toBeConfirmed.length>0">
									<p><img src="../../../img/nodata.png"/></p>
									<p>暂无内容</p>
								</div>
							</div>
						</div>
					</div>
					<div id="item2mobile" class="mui-slider-item mui-control-content">
						<div id="scroll2" class="mui-scroll-wrapper">
							<div class="mui-scroll">
								<section class="panel confirmPanel" v-for="c in confirmed">
									<div>
										<div class="overflow">
											<span class="left">{{c.doctorName}}</span>
											<span class="right">{{c.createTime|replaceT}}</span>
										</div>
										<p>{{c.hospitalName}}</p>
									</div>
									<div class="overflow">
										<i class="iconfont icon-dizhi left"></i>
										<div class="left">{{c.hospitalAddress}} <span @tap="delOrder(c.id)"><i class="iconfont icon-icon2 right"></i></span> </div>
									</div>
									<div class="overflow"> 
										<span>{{c.appointmentPreiod}} 已确认</span>
										<a :href="'tel:'+c.phone"><span class="btn-order-detail right noMarginRight">联系业务员</span></a>
									</div>
								</section>
								<footer class="nomore" v-show="toBeConfirmed.length>0">
									<span></span>
									<span>没有更多了</span>
									<span></span>
								</footer>
								<div class="noData" v-show="!confirmed.length>0">
									<p><img src="../../../img/nodata.png"/></p>
									<p>暂无内容</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		</div>
		<script src="../../../js/mui.min.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="../../../js/vue.js"></script>
		<script src="../../../js/cmms.js?time=333"></script>
		<script>
			new Vue({
				el:"#bespeak",
				data:{
					toBeConfirmed:[],
					confirmed:[],
					confNum:'',
					unconfNum:''
				},
				mounted(){
					this.muiInit();
					this.getBespeak(0);
					this.getBespeak(1);
				},
				methods:{
					muiInit(){
						mui.init({
							swipeBack: false
						});
						mui('.mui-scroll-wrapper').scroll({
							indicators: true //是否显示滚动条
						});
					},
					getBespeak(state){
						let _this = this;
						AT.muiAjaxDoctor("/clinic-doctor/doctor/sel","post",{state},function(res){
//							console.log(res)
							if(state === 0){//待确认
								_this.toBeConfirmed = res;
								switch (_this.toBeConfirmed.length){
									case 0:
										_this.unconfNum = '';
										break;
									default:
										_this.unconfNum = '('+_this.toBeConfirmed.length+')';
										break;
								}
							}else{
							 	_this.confirmed = res;
							 	switch (_this.confirmed.length){
									case 0:
										_this.confNum = '';
										break;
									default:
										_this.confNum = '('+_this.confirmed.length+')';
										break;
								}
							}
						})
					},
					delOrder(id){
						let _this = this;
						let flag = localStorage.getItem('roamFlag');
						console.log(flag);
						if(flag=='true'){
							mui.alert('您无权限操作！');
						}else{
							AT.muiAjaxDoctor("/clinic-doctor/doctor/del","post",{
								id:id
							},function(res){
								console.log(res)
								mui.toast(res);
								if(res=='删除成功'){
									const timer = setTimeout(() =>{                    
										location.reload();              
									}, 1000);  
									_this.$once('hook:beforeDestroy', () => {            
									    clearTimeout(timer);                                    
									});
								}
							});
						}
					}
				}
			})
		</script>
	</body>
</html>
